
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="stylesheet" href="{{url('js/admin/bootstrap.min.css')}}">

  <script type="text/javascript" src="{{url('bootstrap/js/bootstrap.min.js')}}"></script>
  <script type="text/javascript" src="{{url('bootstrap/js/jquery.min.js')}}"></script>
  <script type="text/javascript" src="{{url('bootstrap/js/bootstrap.js')}}"></script>


<title>微博 - 向世界分享你的快乐</title>
<link style="background-color=red"  href="{{url('imgs/login/favicon.ico')}}" type="image/x-icon"/>
<link rel="stylesheet" href="{{url('css/login/main.cc.css')}}"/>
<!--[if lt IE 9]>
<script src="https://static.zhihu.com/static/components/respond/dest/respond.min.js"></script>
<link href="https://static.zhihu.com/static/components/respond/cross-domain/respond-proxy.html" id="respond-proxy" rel="respond-proxy"/>
<link href="/static/components/respond/cross-domain/respond.proxy.gif" id="respond-redirect" rel="respond-redirect"/>
<!--<script src="/static/components/respond/cross-domain/respond.proxy.js"></script>-->
{{--<![endif]-->--}}
</head>
<style type="text/css">
  .big-img{margin-top: 20px;}
  .subtitle{font-family: 宋体}
  .footer{margin-top: 20px}
</style>
<body class="zhi ">
<div class="index-main">
  <div class="index-main-body">
    <div class="index-header">
      <!-- <h1 class="">微   博</h1> -->
      <img src="{{url('img/home/login/big-logo.png')}}" alt="" width="200px;" height="66px;" class="big-img">
      <h2 class="subtitle">随时记录身边事,向世界分享你的快乐
    </div>
    <div class="desk-front sign-flow clearfix sign-flow-simple">
      <div class="index-tab-navs">
        <div class="navs-slider">
          <a href="#signup" class="active" id="zhuce" style="text-decoration:none;">注册</a>

          <a href="#signin" id="denglu" style="text-decoration:none;" >登录</a>
          {{--<span class="navs-slider-bar"></span>    --}}
        </div>
      </div>


      <div class="view view-signin" data-za-module="SignInForm" id="sgin">
        <form action="{{ url('/login_in') }}" method="post" >
          {{csrf_field()}}
          <div class="group-inputs" id="gro">
            <div class="account input-wrapper">
              <input type="text" name="u_name" aria-label="手机号" placeholder="用户名" required="" maxlength="11" />
            </div>
            <div class="verification input-wrapper">
              <input type="password" name="u_pwd" aria-label="密码" placeholder="密码" required=""  />
            </div>
            <div class="Captcha input-wrapper" data-type="cn" data-za-module="Captcha">
              <div class="Captcha-operate">
              </div>
              <div class="Captcha-imageConatiner">
                <img class="Captcha-image" alt="验证码"/>
              </div>
            </div>
          </div>
          <div class="button-wrapper command">
            <button class="sign-button submit" type="submit">登录</button>
          </div>
          <div class="signin-misc-wrapper clearfix">
            <button type="button" class="signin-switch-button">手机验证码登录</button>









            {{--忘记密码--}}
            <a class="unable-login"  id="wang" href="{{url('getback')}}" target="_blank">忘记密码？</a>
            {{--end 忘记密码--}}

            <script>

                wang.onmouseover= function(){

                    wang.style.color = 'red';
                }
                wang.onmouseout =function(){
                    wang.style.color = '';
                }



            </script>

          </div>
          <div class="social-signup-wrapper" data-za-module="SNSSignIn">
            <span class="name js-toggle-sns-buttons">社交帐号登录</span>
            <div class="sns-buttons">
              <a title="微信登录" class="js-bindwechat" href="#"><i class="sprite-index-icon-wechat"></i></a>
              <a title="微博登录" class="js-bindweibo" href="#"><i class="sprite-index-icon-weibo"></i></a>
              <a title="QQ 登录" class="js-bindqq" href="#"><i class="sprite-index-icon-qq"></i></a>
            </div>
          </div>
        </form>

        {{--登录end--}}

        {{-- 二维码界面 --}}
        <div class="QRCode">
          <button class="QRCode-toggleButton" id="xiazai_1">
            <span class="sprite-global-icon-qrcode"></span>
            <span class="QRCode-toggleButtonText " id="span_text_1" >下载微博 App</span>
          </button>
          <div class="QRCode-card"  id="qr_code">
            <div class="QRCode-image">

              {{--//生成的二维码--}}
              <div class="visible-print text-center">
                {{--{!! QrCode::size(250)->generate(Request::url()); !!}--}}
                {{--<p>扫我</p>--}}
              </div>
              {{--生成结束--}}
              {!! QrCode::size(250)->generate(Request::url()); !!}
            </div>
            <div class="sprite-index-icon-arrow">
            </div>
          </div>
        </div>
      </div>

    {{--二维码end--}}

    <div class="view view-signup selected" data-za-module="SignUpForm"  id="sgup">


<!-- 注册表单 -->
  <form class="zhuce" action="{{ url('/login') }}" name="ckname" method="post"  onsubmit="return checkForm()">
              {{ csrf_field() }}
          <div class="group-inputs">
            <div class="name input-wrapper">
              <input required="" type="text" id="pipei" name="u_name" aria-label="姓名" placeholder="昵称最少三位" onchange="checkname()" />
            </div>
            <div class="email input-wrapper">
              <input required="" type="text" id="pptel"  class="account" name="u_tel" aria-label="手机号" placeholder="手机号" onchange="checktel()" maxlength ="11" />
            </div>
            <div class="input-wrapper">
              <input required="" type="password" id="pppw" name="u_pwd" aria-label="密码" placeholder="密码（不少于 6 位）" onchange="checkpwd()" />
            </div>
            <div class="Captcha input-wrapper" data-type="cn" data-za-module="Captcha">
              <div class="Captcha-operate">
              </div>
              <div class="Captcha-imageConatiner">
                <img class="Captcha-image" alt="验证码"/>
              </div>
            </div>



            <div style="float: right;" >

              <span style="color: #5FA6E6;margin-right: 45px;" id="qin">还有密保问题啊~亲 QAQ</span>

              <a href="" style="color:red" data-toggle="modal" data-target="#myModal" id="bbb">* 设置密保验证
              </a>
            </div>

            {{--密保--}}
            <input type="hidden" id="pwt" name="problem" value="">

            <input type="hidden" id="pdn" name="answer" value="">
            {{--密保end--}}



          </div>
          <div class="button-wrapper command" style="margin-top: 8px">
            <button class="sign-button submit" type="submit" id="zhu-wei" disabled="disabled"  title="还有密保哦~">注册微博</button>
          </div>
  </form>




      <!-- Modal -->
      <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
        <div class="modal-dialog" role="document" style="margin-left: 35%;margin-top: 12%">
          <div class="modal-content">
            <div class="modal-header">


              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>
            <div class="" style="marigin-leift:50px">

              {{--密保--}}
              <div class="input-group" style="width:160px;height: 2px;margin-left: 70px;margin-top: 8px;margin-bottom: 5px">
                <span class="input-group-addon" id="basic-addon1" style="width: 30px" >选择你的密保问题</span>
                <select name="problem" id="pro" class="form-control" style="width: 172px;">
                  <option value="我的名字">我的名字</option>
                  <option value="毕业哪个学校">毕业哪个学校</option>
                  <option value="我的高三班主任">我的高三班主任</option>
                </select>
              </div>

              {{--end 密保--}}

              {{--答案--}}
              <div class="input-group" style="width:160px;height: 2px;margin-left: 70px;margin-top: 8px;margin-bottom: 5px">
                <span class="input-group-addon" id="basic-addon1" style="width: 50px" >输入你的答案</span>
                <input type="text"  name="papers" id="answer" class="form-control" placeholder="your answer" aria-describedby="basic-addon1" style="width: 200px;">
              </div>

              {{--end 答案--}}

              {{--************************************--}}
              <input type="hidden" value="85" name="id">

            </div>
            <div class="modal-footer">
             <span id="ao"> <button type="button" class="btn btn-primary" data-dismiss="modal" id="bbt">保存</button></span>


              <script>

                  answer.onkeydown=function(){

                      var bbt = document.getElementById('bbt');
                      var ans = document.getElementById('answer').value;
                      if (ans.length <= 1){
                          bbt.disabled = true;
                      }
                      if (ans.length > 1){
                          bbt.disabled = false;
                      }

                  }


                  bbt.onclick=function(){

                      var qin = document.getElementById('qin');
                      qin.style.display = 'none';

                      //获取问题数据
                      var pro = document.getElementById('pro').value;
                      var ans = document.getElementById('answer').value;

                      //先把密保数据输过去
                      $.ajax({
                          type:'get',
                          url:"{{url('mibao')}}/" + pro +'/'+ ans ,
//                      headers: {
//                          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
//                      },
                          success:function(data){
                              //console.log(data);

                              if (data){
                                  $('#pwt').val(data[0]);
                                  $('#pdn').val(data[1]);

                                  var pdn = document.getElementById('pdn').value;
                                  //判断密保答案是否存入

                                  if (pdn){
                                  var zhu = document.getElementById('zhu-wei');
                                      zhu.disabled = false;
                                      zhu.title = '';
                                  }

                              }
                          },
                          error: function(){

                          }

                      })
                  }







              </script>



            </div>
          </div>
        </div>
      </div>

    {{--end  motai--}}






<!-- 注册end -->
        <p class="agreement-tip">
          点击「注册」按钮，即代表你同意<a href="/terms" target="_blank">《微博协议》</a>
        </p>
        <div class="QRCode">
          <button class="QRCode-toggleButton" id="xiazai">
            <span class="sprite-global-icon-qrcode"></span>
            <span class="QRCode-toggleButtonText "  id="span_text">下载微博 App</span></button>
          <div class="QRCode-card"  id="qr_code_1" style="display: none;">
            <div class="QRCode-image">

              {{--//生成的二维码--}}
              <div class="visible-print text-center">
{{--                {!! QrCode::size(250)->generate(Request::url()); !!}--}}
                {{--<p>扫我</p>--}}
              </div>
              {!! QrCode::size(250)->generate(Request::url('www.baidu.com')); !!}
            {{--生成结束--}}
            </div>
            <div class="sprite-index-icon-arrow">
            </div>
          </div>




        </div>
      </div>
    </div>
  </div>
</div>



<div class="footer" style="margin-top: 80px">
  <span>&copy; 2017 微博</span>
  <span class="dot">&middot;</span>
  <a target="_blank" href="https://zhuanlan.zhihu.com">微博专栏</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/roundtable">微博圆桌</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/explore" data-za-c="explore" data-za-a="visit_explore" data-za-l="home_bottom_explore">发现</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/app">移动应用</a>
  <span class="dot">&middot;</span>
  <a href="/org/signin" class="footer-mobile-show">使用机构帐号登录</a>
  <span class="dot footer-mobile-show">&middot;</span>
  <a href="/contact" class="footer-mobile-show">联系我们</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/careers">来sina微博工作</a>
  <br/>
  <a href="http://www.miibeian.gov.cn/" target="_blank">沪 FBI 证 9188888 号</a>
  <span class="dot">&middot;</span>
  <span>京沪网安备 9999999999999 号</span>
  <span class="dot">&middot;</span>
  <a href="http://zhstatic.zhihu.com/assets/zhihu/publish-license.jpg" target="_blank">出版物经营许可证</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/jubao">侵权投诉</a>
  <span class="dot">&middot;</span>
  <span>违法和不良信息举报：6666666666</span>
  <div class="chengxing">
    <a id="___szfw_logo___" href="https://credit.szfw.org/CX20170607038331320388.html" target="_blank"><img src="./img/home/chengxing_logo@2x.65dc76e8.png" border="0"/></a>
  </div>

  <script src="{{url('js/home/jquery-1.8.3.min.js')}}"></script>

  <script>

      var signin = document.getElementById('sgin');
      var signup = document.getElementById('sgup');
      var groo = document.getElementById('gro');


      denglu.onclick =function() {

          $("#sgin").addClass('selected','selected');
          $('#sgup').removeClass('selected');
          $('#denglu').addClass('active');
          $('#zhuce').removeClass('active');
      }

      zhuce.onclick =function() {

          $("#sgin").removeClass('selected');
          $('#sgup').addClass('selected','selected');
          $('#zhuce').addClass('active');
          $('#denglu').removeClass('active');
      }



      // 登录二维码部分
      xiazai_1.onclick= function(){

          $('#qr_code').fadeToggle('slow','linear');
      }

      //注册部分的二维码
      xiazai.onclick= function(){

          $('#qr_code_1').fadeToggle('slow','linear');
      }



        pipei.onchange=function(){


            $.ajax({
                type:'get',
                url:"{{url('ajax')}}/" + ckname,
                success:function(data){
                    if (data == 1){
                        alert('用户已存在');
                    }
                },
                error: function(){

                    alert('Ajax error!7777');
                }

            })


        }




      //用户名验证
    function checkname(){

          var ckname = document.ckname.u_name.value;

          if (ckname){
              {{--$.ajax({--}}
              {{--type:'get',--}}
              {{--url:"{{url('ajax')}}/" + ckname,--}}
              {{--success:function(data){--}}
                {{--if (data == 1){--}}
                    {{--alert('用户已存在');--}}
                    {{--}--}}
              {{--},--}}
              {{--error: function(){--}}

                     {{--alert('Ajax error!7777');--}}
                {{--}--}}

              {{--})--}}


              if (ckname.match(/^([a-zA-Z0-9_\u4e00-\u9fa5]){3,16}$/) == null) {

              $('#pipei').after("<label id='666' class='error is-visible'>由数字字母下划线任意组成</label>");

              //获取焦点
              var input = document.getElementById('pipei');
              input.onfocus =function(){

              $('#666').remove();


              }

                  return false;


              }else{

                  return true;

              }
          }




    }

      //手机号验证
      function checktel(){

          var ckname = document.ckname.u_tel.value;

          if (ckname.match(/^0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8}$/) == null) {

              $('#pptel').after("<label id='777' class='error is-visible'>请输入正确的手机号</label>");
              //获取焦点
              var input = document.getElementById('pptel');
              input.onfocus =function(){
                  $('#777').remove();
              }

              return false;
          }else{


              return true;
          }
      }

      //密码验证
      function checkpwd(){

          var ckname = document.ckname.u_pwd.value;

          if (ckname.length < 6 || ckname.length > 18) {

              $('#pppw').after("<label id='778' class='error is-visible'>密码长度最少六位</label>");
              //获取焦点
              var input = document.getElementById('pppw');
              input.onfocus =function(){
                  $('#778').remove();
              }

              return false;

          }else{

              return true;
          }


      }


      //验证全部为 true 时  执行发送数据
      function checkForm(){

          return  checkpwd() && checkname() && checktel();
      }






  </script>

  </body>
  </html>